<template>
	<view>
		<mescroll-uni @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback" @up="upCallback">
			<view class="content">
				<view class="container"
					:style='{ "minHeight": "100vh", "width": "100%", "padding": "60rpx 0 160rpx", "position": "relative", "background": "url(http://codegen.caihongy.cn/20221229/cd91288d91b74c7fbf67fdc76498bf17.gif) no-repeat left top / 100% auto,url(http://codegen.caihongy.cn/20221229/be9a592af083470ebaeeafa6f062e534.gif) no-repeat left bottom / 100% auto,url(http://codegen.caihongy.cn/20221229/401a0c9f5ae64ab7bced56c475f40822.png) no-repeat center top / 100% auto,url(http://codegen.caihongy.cn/20221229/35df15480d2d4680b0171ef8190b3774.png) no-repeat center bottom / 100% auto,linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(65,201,154,1) 100%),#fff", "height": "auto" }'>
					<swiper
						:style='{ "padding": "0px ", "margin": "0px auto", "borderColor": "#FEB7D2", "borderRadius": "40rpx", "background": "rgba(255,255,255,1)", "borderWidth": "0px", "width": "calc(100% - 60rpx)", "borderStyle": "dotted", "height": "360rpx" }'
						class="swiper" :indicator-dots='false' :autoplay='true' :circular='false' indicator-active-color='#000000'
						indicator-color='rgba(0, 0, 0, .3)' :duration='500' :interval='5000' :vertical='false'>
						<swiper-item :style='{ "width": "100%", "borderRadius": "40rpx", "background": "none", "height": "360rpx" }'
							v-for="(swiper, index) in swiperList" :key="index">
							<image
								:style='{ "width": "calc(100% - 0px)", "margin": "0 auto", "objectFit": "cover", "borderRadius": "40rpx", "display": "block", "height": "360rpx" }'
								mode="aspectFill" v-if="swiper.substring(0, 4) == 'http'" :src="swiper"></image>
							<image
								:style='{ "width": "calc(100% - 0px)", "margin": "0 auto", "objectFit": "cover", "borderRadius": "40rpx", "display": "block", "height": "360rpx" }'
								mode="aspectFill" v-else :src="baseUrl + swiper"></image>
						</swiper-item>
					</swiper>

					<view
						:style='{ "padding": "0px 20rpx 24rpx", "flexWrap": "wrap", "background": "url() no-repeat center bottom / 100% auto", "display": "flex", "width": "100%", "justifyContent": "space-between", "height": "auto" }'
						class="detail-content">
						<!-- 预约景点 -->

						<!-- <view class="yuyuejingdianBtn">
							<view class="yuyueText" @tap="tapYuyuejingdian">
								预约景区
							</view>
						</view> -->

						<view class="yuyuejingdianBtn">
							<view class="yuyueText" :class="{ 'disabled': !canTapYuyue }" @tap="tapYuyuejingdian"
								:style="{ 'background-color': canTapYuyue ? '#5acfa4' : '#ccc' }">
								预约景区
							</view>
							<view class="yuyueText" :class="{ 'disabled': !canTapYuyue }" @tap="gotoYuyuejingdian"
								:style="{ 'background-color': '#007ACC' }">
								导航景区
							</view>
						</view>



						<view
							:style='{ "minHeight": "80rpx", "padding": "0px 20rpx 0px", "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "margin": "10rpx 0 24rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "justifyContent": "space-between" }'
							class="detail-list-item price priceFavor">
							<view
								:style='{ "border": "0px solid #FEB7D2", "boxShadow": "0px 0px 0px #ccc", "margin": "16rpx 12rpx 0", "color": "#fc6f06", "textAlign": "center", "display": "block", "borderRadius": "100%", "background": "none", "width": "64rpx", "lineHeight": "48rpx", "fontSize": "48rpx", "textShadow": "0px 0px 0px #ccc", "height": "64rpx" }'
								v-if="storeupFlag == 1" class="cuIcon-favorfill" @click="shoucang"></view>
							<view
								:style='{ "border": "0px solid #FEB7D2", "boxShadow": "0px 0px 0px #ccc", "margin": "16rpx 12rpx 0", "color": "#fc6f06", "textAlign": "center", "display": "block", "borderRadius": "100%", "background": "none", "width": "64rpx", "lineHeight": "48rpx", "fontSize": "48rpx", "textShadow": "0px 0px 0px #ccc", "height": "64rpx" }'
								v-if="storeupFlag == 0" class="cuIcon-favor" @click="shoucang"></view>
						</view>

						<view
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'
							class="detail-list-item title">
							<view
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'
								class="lable">景点名称：</view>
							<view
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'
								class="text">{{ detail.jingdianmingcheng }}</view>
						</view>
						<view
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'
							class="detail-list-item title">
							<view
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'
								class="lable">等级：</view>
							<view
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'
								class="text">{{ detail.dengji }}</view>
						</view>
						<view
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'
							class="detail-list-item title">
							<view
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'
								class="lable">票价：</view>
							<view
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'
								class="text">{{ detail.piaojia }}</view>
						</view>
						<view
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'
							class="detail-list-item title">
							<view
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'
								class="lable">票数：</view>
							<view
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'
								class="text">{{ detail.piaoshu }}</view>
						</view>

						<view class="detail-list-item"
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'>
							<view class="lable"
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'>
								景点类型：</view>
							<view class="text"
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'>
								{{ detail.jingdianleixing }}</view>
						</view>
						<view class="detail-list-item"
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'>
							<view class="lable"
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'>
								开放时间：</view>
							<view class="text"
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'>
								{{ detail.kaifangshijian }}</view>
						</view>
						<view class="detail-list-item"
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'>
							<view class="lable"
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'>
								服务电话：</view>
							<view class="text"
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'>
								{{ detail.fuwudianhua }}</view>
						</view>
						<view class="detail-list-item"
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "16rpx 40rpx 16rpx", "margin": "20rpx 0 20rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'>
							<view class="lable"
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'>
								详细地址：</view>
							<view class="text"
								:style='{ "width": "100%", "padding": "0px 20rpx 20rpx 0", "margin": "0px 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555" }'>
								{{ detail.xiangxidizhi }}</view>
						</view>





						<view class="detail-list-item rich"
							:style='{ "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "padding": "24rpx 24rpx 64rpx", "margin": "0 0 24rpx 0", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "flexWrap": "wrap", "borderWidth": "0px 0px 0px 0px", "background": "rgba(255,255,255,.9)", "display": "flex", "width": "100%", "borderStyle": "dotted dashed solid", "height": "auto" }'>
							<view class="lable"
								:style='{ "width": "100%", "padding": "0 20rpx 0 0", "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#333", "textAlign": "left" }'>
								景点详情</view>
							<view class="rich-text"
								:style='{ "minHeight": "240rpx", "border": "0px solid #f7de91", "padding": "0 20rpx 0 0", "boxShadow": "0 0px 0px rgba(182,158,18,.4),inset 0px 0px 0px 0px #fcf6d6", "margin": "0", "borderRadius": "8rpx", "color": "#555", "background": "none", "width": "100%", "lineHeight": "48rpx", "textIndent": "2em" }'>
								<rich-text :nodes="detail.jingdianxiangqing"></rich-text>
							</view>
						</view>


						<view class="time-content"
							:style='{ "width": "100%", "margin": "20rpx 0 24rpx 0", "background": "url() no-repeat center top / 100% auto", "height": "auto" }'>
							<view class="comoment-header"
								:style='{ "border": "0px solid #5959d9", "boxShadow": "0px 0px 0px #c1c1f2", "padding": "0px 0 0 10%", "margin": "0px auto 60rpx", "borderRadius": "20rpx", "background": "url(http://codegen.caihongy.cn/20221229/62fd669820954f7c9e5443e70e79633a.png) no-repeat center top / 100% 100%", "display": "flex", "width": "calc(100% + 0px)", "justifyContent": "space-between", "height": "auto" }'>
								<view
									:style='{ "minHeight": "132rpx", "padding": "0px 20rpx 0px 60rpx", "lineHeight": "100rpx", "fontSize": "28rpx", "color": "#fff", "fontWeight": "600" }'>
									评论</view>
								<view
									:style='{ "border": "0px solid #64b7ea", "padding": "0 100rpx 0 0", "margin": "16rpx 16rpx 12rpx ", "borderRadius": "12rpx", "background": "none", "display": "flex", "height": "68rpx" }'
									@click="onCommentTap" class="btn-comment-content" style="display: flex;align-items: center;">
									<view :style='{ "margin": "0px 8rpx 0", "lineHeight": "60rpx", "fontSize": "24rpx", "color": "#fff" }'
										class="cuIcon-add"></view>
									<view :style='{ "margin": "0px 0 0", "lineHeight": "60rpx", "fontSize": "24rpx", "color": "#eee" }'>
										添加评论</view>
								</view>
							</view>

							<view
								:style='{ "padding": "24rpx", "boxShadow": "0px 0px 2rpx #bbb,inset 0px 0px 0px 0px #eee", "margin": "0px auto 32rpx", "borderColor": "#c8c8ef", "borderRadius": "24rpx", "background": "rgba(255,255,255,.9)", "borderWidth": "0px 0px 0px", "width": "calc(100% - 0px)", "borderStyle": "dotted dashed solid", "height": "auto" }'
								v-for="(item, index) in commentList" v-bind:key="index" class="cu-item comment-item">
								<view :style='{ "width": "100%", "display": "flex", "height": "auto" }'>
									<image
										:style='{ "width": "60rpx", "margin": "0 8rpx 0 0", "borderRadius": "100%", "display": "block", "height": "60rpx" }'
										v-if="item.avatarurl" mode="aspectFill" :src="baseUrl + item.avatarurl"></image>
									<view :style='{ "color": "#333", "lineHeight": "60rpx", "fontSize": "28rpx" }' class="text-grey">
										{{ item.nickname }}</view>
								</view>
								<view
									:style='{ "padding": "20rpx", "margin": "24rpx 0", "borderColor": "#FEB7D2", "color": "#333", "borderRadius": "0px", "background": "none", "borderWidth": "0px 0px 0px", "lineHeight": "1.5", "fontSize": "28rpx", "textIndent": "2em", "borderStyle": "dotted dashed dotted" }'
									class="text-gray text-content text-df">
									{{ item.content }}
								</view>
								<view :style='{ "lineHeight": "48rpx", "fontSize": "28rpx", "color": "#555", "textAlign": "right" }'
									class="margin-top-sm text-gray text-df">{{ item.addtime }}</view>
								<view v-if="item.reply"
									:style='{ "padding": "20rpx", "margin": "24rpx 0", "borderColor": "#FEB7D2", "color": "#333", "borderRadius": "0px", "background": "none", "borderWidth": "0px 0px 0px", "lineHeight": "1.5", "fontSize": "28rpx", "textIndent": "2em", "borderStyle": "dotted dashed dotted" }'
									class="text-gray text-content text-df">
									回复:{{ item.reply }}
								</view>
							</view>
						</view>

						<!-- <view class="bottom-content bg-white tabbar border shop"
							:style='{ "width": "100%", "padding": "20rpx 0px", "flexWrap": "wrap", "background": "none", "display": "flex", "height": "auto" }'>

							<button
								:style='{ "border": "0", "padding": "0 20rpx", "margin": "0", "color": "rgb(255, 255, 255)", "background": "rgb(255, 170, 51)", "width": "auto", "fontSize": "28rpx", "height": "80rpx" }'
								v-if="userid && isAuth('jingdianxinxi', '购票')" @tap="onAcrossTap('menpiaoyuding', '', '', '')"
								class="cu-btn bg-brown round shadow-blur">购票</button>
							<button
								:style='{ "border": "0", "padding": "0 20rpx", "margin": "0", "color": "rgb(255, 255, 255)", "background": "rgb(255, 170, 51)", "width": "auto", "fontSize": "28rpx", "height": "80rpx" }'
								v-if="!userid && isAuthFront('jingdianxinxi', '购票')" @tap="onAcrossTap('menpiaoyuding', '', '', '')"
								class="cu-btn bg-brown round shadow-blur">购票</button>
						</view> -->
					</view>

				</view>
			</view>
		</mescroll-uni>
	</view>
</template>

<script>
export default {
	data() {
		return {
			lat: -1,
			lng: -1,
			isOpen: '',
			yuyueInfoForm: {
				userid: '',
				nickname: '',
				jingdianid: '',
				jingdianname: ''
			},
			canTapYuyue: false,
			btnColor: ['#409eff', '#67c23a', '#909399', '#e6a23c', '#f56c6c', '#356c6c', '#351c6c', '#f093a9',
				'#a7c23a', '#104eff', '#10441f', '#a21233', '#503319'
			],
			id: '',
			userid: '',
			detail: {},
			swiperList: [],
			commentList: [],
			mescroll: null, //mescroll实例对象
			downOption: {
				auto: false //是否在初始化后,自动执行下拉回调callback; 默认true
			},
			upOption: {
				noMoreSize: 3, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
				textNoMore: '~ 没有更多了 ~',
			},
			hasNext: true,
			user: {},
			storeupFlag: 0,
			count: 0,
			timer: null
		}
	},
	computed: {
		baseUrl() {
			return this.$base.url;
		},
	},
	async onLoad(options) {
		this.id = options.id;
		if (options.userid) {
			this.userid = options.userid;
		}
		if (options.lat) {
			this.lat = options.lat;
		}
		if (options.lng) {
			this.lng = options.lng;
		}
		// 渲染数据
		this.init();
	},
	onUnload() {
		if (this.timer) {
			clearInterval(this.timer);
		}
	},
	async onShow(options) {
		let table = uni.getStorageSync("nowTable");
		// 获取用户信息
		let res = await this.$api.session(table);
		this.user = res.data;
		console.log('this.user: ', this.user)
		this.btnColor = this.btnColor.sort(() => {
			return (0.5 - Math.random());
		});
		this.getStoreup();
		let cleanType = uni.getStorageSync('discussjingdianxinxiCleanType')
		if (cleanType) {
			uni.removeStorageSync('discussjingdianxinxiCleanType')
			this.mescroll.num = 1
			this.upCallback(this.mescroll)
		}
	},
	destroyed: function () {
		//window.clearInterval(this.inter);
	},
	methods: {
		// gotoYuyuejingdian() {
		// 	self.mapCtr.moveToLocation(obj)
		// 	self.mapCtr.translateMarker({
		// 		markerId: 1,
		// 		autoRotate: true,
		// 		duration: 100,
		// 		destination: {
		// 			latitude: obj.latitude,
		// 			longitude: obj.longitude,
		// 		},
		// 		animationEnd() {
		// 			// console.log('animation end')
		// 		}
		// 	})
		// },
		gotoYuyuejingdian() {
			console.log('123')
			let latitude = this.lat;
			console.log('%c [ latitude ]-313', 'font-size:13px; background:pink; color:#bf2c9f;', latitude)
			let longitude = this.lng;
			console.log('%c [ longitude ]-315', 'font-size:13px; background:pink; color:#bf2c9f;', longitude)
			// console.log(latitude)
			uni.openLocation({
				latitude: Number(latitude),
				longitude: Number(longitude),
				success: function (res) {
					// console.log(res);
				}
			});

		},
		// 点击预约
		async tapYuyue() {
			this.yuyueInfoForm.userid = this.user.id
			this.yuyueInfoForm.nickname = this.user.yonghuming
			this.yuyueInfoForm.jingdianid = this.detail.id
			this.yuyueInfoForm.jingdianname = this.detail.jingdianmingcheng
			const res = await this.$api.add(`yuyuexinxi`, this.yuyueInfoForm);
			if (res.code == 0) {
				this.$utils.msg('预约成功！');
			}
			console.log('this.yuyueList: ', res)

		},
		tapYuyuejingdian() {
			if (this.isOpen === '0') {
				this.$utils.msg('该景区暂未开发预约！');
				return
			}
			uni.showModal({
				title: '提示',
				content: '是否预约该景区？',
				showCancel: true, // 是否显示取消按钮
				cancelText: '取消', // 取消按钮的文本内容
				confirmText: '确定', // 确定按钮的文本内容
				success: (res) => {
					if (res.confirm) {
						this.tapYuyue()
						console.log('用户点击确定');
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				},
			});
		},

		// 支付
		onPayTap() {
			uni.setStorageSync('paytable', 'jingdianxinxi');
			uni.setStorageSync('payObject', this.detail);

			this.$utils.jump('../pay-confirm/pay-confirm?type=1')
		},
		onDetailTap(item) {

			uni.setStorageSync("useridTag", this.userid);
			this.$utils.jump(`./detail?id=${item.id}&userid=` + this.userid)
		},
		// 收藏
		async getStoreup() {
			let params = {
				page: 1,
				limit: 1,
				refid: this.id,
				tablename: 'jingdianxinxi',
				userid: this.user.id,
				type: 1,
			}
			let res = await this.$api.list(`storeup`, params);

			this.storeupFlag = res.data.list.length;
		},
		async shoucang() {
			let _this = this;
			let params = {
				page: 1,
				limit: 1,
				refid: _this.detail.id,
				tablename: 'jingdianxinxi',
				userid: _this.user.id,
				type: 1,
			}
			let res = await _this.$api.list(`storeup`, params);
			if (res.data.list.length == 1) {
				let storeupId = res.data.list[0].id;
				uni.showModal({
					title: '提示',
					content: '是否取消',
					success: async function (res) {
						if (res.confirm) {
							await _this.$api.del('storeup', JSON.stringify([storeupId]));
							_this.$utils.msg('取消成功');
							_this.getStoreup();
						}
					}
				});
				return;
			}
			uni.showModal({
				title: '提示',
				content: '是否收藏',
				success: async function (res) {
					if (res.confirm) {
						await _this.$api.add('storeup', {
							userid: _this.user.id,
							name: _this.detail.jingdianmingcheng,
							picture: _this.swiperList[0],
							refid: _this.detail.id,
							tablename: 'jingdianxinxi',
							type: 1
						});
						_this.$utils.msg('收藏成功');
						_this.getStoreup();
					}
				}
			});
		},
		// 跨表
		onAcrossTap(tableName, crossOptAudit, statusColumnName, tips, statusColumnValue) {
			uni.setStorageSync('crossTable', 'jingdianxinxi');
			uni.setStorageSync(`crossObj`, this.detail);
			uni.setStorageSync(`statusColumnName`, statusColumnName);
			uni.setStorageSync(`statusColumnValue`, statusColumnValue);
			uni.setStorageSync(`tips`, tips);
			if (statusColumnName != '' && !statusColumnName.startsWith("[")) {
				var obj = uni.getStorageSync('crossObj');
				for (var o in obj) {
					if (o == statusColumnName && obj[o] == statusColumnValue) {
						this.$utils.msg(tips);
						return
					}
				}
			}
			this.$utils.jump(`../${tableName}/add-or-update?cross=true`);
		},
		// 获取详情
		async init() {
			if (this.timer) {
				clearInterval(this.timer);
			}
			let res = await this.$api.info('jingdianxinxi', this.id);
			this.detail = res.data;
			console.log('this.detail: ', this.detail)
			this.isOpen = this.detail.isOpen
			if (this.detail.isOpen === '1') {
				this.canTapYuyue = true
			}

			// 轮播图片
			this.swiperList = this.detail.tupian ? this.detail.tupian.split(",") : [];
			//修改富文本的图片样式
			this.detail.jingdianxiangqing = this.detail.jingdianxiangqing.replace(/img src/gi,
				"img style=\"width:100%;\" src");
		},

		// mescroll组件初始化的回调,可获取到mescroll对象
		mescrollInit(mescroll) {
			this.mescroll = mescroll;
		},

		/*下拉刷新的回调 */
		downCallback(mescroll) {
			this.hasNext = true
			mescroll.resetUpScroll()
		},

		/*上拉加载的回调: mescroll携带page的参数, 其中num:当前页 从1开始, size:每页数据条数,默认10 */
		async upCallback(mescroll) {
			let res = await this.$api.list('discussjingdianxinxi', {
				page: mescroll.num,
				limit: 10,
				refid: this.id
			});
			// 如果是第一页数据置空
			if (mescroll.num == 1) this.commentList = [];
			this.commentList = this.commentList.concat(res.data.list);
			if (res.data.list.length == 0) this.hasNext = false;
			mescroll.endSuccess(mescroll.size, this.hasNext);

		},



		onChatTap() {
			this.$utils.jump('../chat/chat')
		},
		// 下载
		download(url) {
			let _this = this;
			url = _this.$base.url + url;
			uni.downloadFile({
				url: url,
				success: (res) => {
					if (res.statusCode === 200) {
						_this.$utils.msg('下载成功');
						window.open(url);
					}
				}
			});
		},
		//
		onCartTabTap() {
			this.$utils.tab('../shop-cart/shop-cart')
		},
		// 添加评论
		async onCommentTap() {
			this.$utils.jump(`../discussjingdianxinxi/add-or-update?refid=${this.id}`)
		},
		onSHTap() {
			this.$refs.popup.open()
		},
	}
}
</script>

<style lang="scss" scoped>
.yuyuejingdianBtn {
	display: flex;
	width: 100%;
	margin-top: 40rpx;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.yuyueText {
	width: 200rpx;
	height: 100rpx;
	display: flex;
	border-radius: 5px;
	align-items: center;
	justify-content: center;
	color: #fff;
	margin-bottom: 10px;
	transition: background-color 0.3s ease; // 添加渐变效果
}

.yuyueText.disabled {
	background-color: #ccc;
	cursor: not-allowed;
}

// .yuyuejingdianBtn{
// 	display: flex;
// 	width: 100%;
// 	margin-top: 40rpx;
// 	align-items: center;
// 	justify-content: center;
// 	.yuyueText{
// 		width: 200rpx;
// 		height: 100rpx;
// 		display: flex;
// 		border-radius: 5px;
// 		align-items: center;
// 		justify-content: center;
// 		color: #fff;
// 		background-color: #5acfa4;
// 		margin-bottom: 10px;
// 	}
// }
.content {
	min-height: calc(100vh - 44px);
	box-sizing: border-box;
}

.seat-list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	background: #FFFFFF;
	margin: 20upx;
	border-radius: 20upx;
	padding: 20upx;
	font-size: 30upx;

	.seat-item {
		width: 33.33%;
		display: flex;
		align-items: center;
		flex-direction: column;
		margin-bottom: 20upx;

		.seat-icon {
			width: 50upx;
			height: 50upx;
			margin-bottom: 10upx;
		}
	}
}

audio {
	display: flex;
	flex-direction: column;
}

.audio /deep/ .uni-audio-default {
	width: inherit;
}
</style>